import React,{useState,useEffect} from 'react'
import '../style/activityDataInfo.less'
export default function activityInfoBasic(props:any) {
    const [basicData,setBasicData]:any = useState({})
    useEffect(()=>{
        if(JSON.stringify(props.formData) !== '{}'){
            let obj = {
                ...props.formData
            }
            console.log(obj.scheduleVOS)
            let add = `${obj.provinceName} ${obj.cityName} ${obj.activitySite}`
            let basic = {
                activityName:obj.activityName,
                activityAdd:add,
                activityTime:`${obj.startDate} - ${obj.endDate}`,
                activityContent:obj.activityContent,
                activityPicture:obj.pictureUrl,
                activityThumbnailPicture:obj.thumbnailPictureUrl,
                activityScheduleVOS:[...obj.scheduleVOS]
            }
            setBasicData(basic)
        }
    },[props.formData])
  return (
    <div className='activity_basic'>
        <ul>
            <li><span>活动名称：</span>{basicData.activityName}</li>
            <li><span>活动地址：</span>{basicData.activityAdd}</li>
            <li><span>活动时间：</span>{basicData.activityTime}</li>
            <li><span>活动内容：</span>{basicData.activityContent}</li>
            <li><span>活动图片：</span><img src={basicData.activityPicture}></img></li>
            <li><span>活动缩略图：</span><img src={basicData.activityThumbnailPicture}></img></li>
            <li><span>活动日程：</span>
                {
                    basicData.activityScheduleVOS? basicData.activityScheduleVOS.map((el:any) =>{
                        return (<div key={el.scheduleId}>
                            <span>{el.scheduleName} - {el.scheduleDate}</span>
                        </div>)
                    }) : null
                }
            </li>
        </ul>
    </div>
  )
}
